<!--
 * @Author: 张帆 zhangfan@jxtech.net
 * @Date: 2024-12-16 12:07:39
 * @LastEditors: 张帆 zhangfan@jxtech.net
 * @LastEditTime: 2025-01-20 17:18:53
 * @FilePath: /vue3-demo/vue3_test/src/App.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%A
-->
<template>
  <div>
    <div>我是iframe页面</div>
    <!-- <button @click="sendMessage">发送消息到父页面</button> -->
  </div>
</template>

<script>
import { ref, onMounted, onUnmounted } from "vue";
export default {
  name: "App",
  components: {
  },
  setup() {
    let isShowDemo = ref(true);

    onMounted(() => {
      console.log('子页面iframe页面加载完成')
      window.addEventListener('message', handleMessage);

      // 在组件卸载时移除事件监听器
      // return () => {
      //   window.removeEventListener('message', handleMessage);
      // };
    });

    onUnmounted(() => {
    })

    function handleMessage(event) {
      console.log('子页面收到消息啦==', event)
      console.log('event.data==', event.data);
    }

    return {
      isShowDemo,
      handleMessage
    }
  },
};
</script>
